$(function() {
  // 模拟点击，进入 index.html 主页之后，让左侧菜单的第一项处于默认选中状态，从而防止右侧主体为空的情况
  $('#firstNavItem').click()

  // 获取用户的基本信息
  $.get('/my/userinfo', function(res) {
    // 获取用户信息失败
    if (res.status !== 0) {
      return layer.msg('获取用户信息失败！')
    }
    // 获取用户信息成功
    renderAvatar(res.data)
  })

  // 用户点击退出登录按钮
  $('#btnLogout').on('click', function() {
    // 1. 询问用户是否真的要退出
    layer.confirm('确定退出登录?', { icon: 3, title: '提示' }, function(index) {
      //do something
      // 1.1 清空本地存储的 token
      localStorage.removeItem('token')
      // localStorage.removeItem('user')
      // 1.2 重定向到登录页面
      location.href = './login.html'

      // 关闭 confirm 询问框
      layer.close(index)
    })
  })
})

// 渲染用户头像
function renderAvatar(user) {
  // 获取用户名
  var username = user.nickname || user.username
  // 1. 存在用户头像
  if (user.user_pic) {
    // 1.1 修改 header 区域的头像
    $('#header-avatar').html('<img src="' + user.user_pic + '" class="layui-nav-img"/>个人中心')
    // 1.2 修改 sidebar 区域的头像
    $('.user-info').html(
      '<img src="' +
        user.user_pic +
        '" class="layui-nav-img" /><div class="welcome"><span>欢迎&nbsp;&nbsp;<span id="username">' +
        username +
        '</span></span></div>'
    )
    return
  }

  // 2. 不存在用户头像
  // 2.1 修改 header 区域的头像
  $('#header-avatar').html('<div class="textAvatar">' + username[0].toUpperCase() + '</div>个人中心')
  // 2.2 修改 sidebar 区域的头像
  $('.user-info').html(
    '<div class="textAvatar">' +
      username[0].toUpperCase() +
      '</div><div class="welcome"><span>欢迎&nbsp;&nbsp;<span id="username">' +
      username +
      '</span></span></div>'
  )
}
